import Dialog from './../Dialog';

import Content from './main.vue';
import Loading from './loading.vue';

export interface Button {
    text: string,
    color?: string,
    onClick?: Function,
    backgroundColor?: string
}

export interface Options {
    title?: string,
    message?: string,
    buttons: Array<Button>
}

export interface Confirm {
    title?: string,
    message?: string,
    onCancel?: Function,
    onConfirm?: Function
}

export interface Alert {
    title?: string,
    message?: string,
    onOk?: Function
}

const defaultButtons = [
    {
        text: `取消`,
        color: `#777`,
        onClick: () => {}
    },
    {
        text: `确定`,
        onClick: () => {}
    }
]

const _PopUp = (options: Options): void => {
    const {
        title,
        message,
        buttons = []
    } = (options || {}) as Options;

    const btn = !!buttons.length ?
        buttons : defaultButtons;

    new Dialog(Content, {
        title: title,
        text: message,
        buttons: btn
    }).show();
}

const _Confirm = (options: Confirm = {}) => {
    const {
        title,
        message,
        onCancel,
        onConfirm
    } = options;
    const buttons = ([
        {
            text: `取消`,
            color: `#777`,
            onClick: onCancel
        },
        {
            text: `确定`,
            onClick: onConfirm
        }
    ]);
    return _PopUp({
        title,
        message,
        buttons
    })
}

const _Alert = (options: Alert) => {
    const {
        title,
        message,
        onOk
    } = options;
    const buttons = [{
        text: `知道啦~`,
        onClick: onOk,
        backgroundColor: `#f6f6f6`
    }];
    return _PopUp({
        title,
        message,
        buttons
    })
}

const _Loading = () => {
    const _loading = (
        new Dialog(Loading)
    );
    return {
        show: () => {
            _loading.show({
                maskOpacity:.3,
                position: `none`,
                clickClose: false
            })
        },
        close: () => {
            _loading.close();
        }
    }
}

const _default = {
    Alert: _Alert,
    Confirm: _Confirm,
    Loading: _Loading()
}

export default _default;
